<template>
	<view class="reply">
		<view class="top">
			<comment-item :receiveCommentObj="topComment"></comment-item>
		</view>
		<view class="list">
			<u-empty v-show="!secondComment.length" text="暂时没有回复哦~~"
				icon="http://cdn.uviewui.com/uview/empty/comment.png"></u-empty>

			<view class="row" v-for="item in secondComment">
				<comment-item :receiveCommentObj="item"></comment-item>
			</view>
		</view>

		<view>
			<comment-frame @emitComment="handleComent" :placeholder="userName" :commentObj="postData"></comment-frame>
		</view>

	</view>
</template>

<script>
	import {
		getUserInfo
	} from "../../utils/common.js"

	import commentItem from "@/components/comment/cpns/comment-item/comment-item.vue"
	import {
		userField
	} from "@/config/index.config.js"

	const db = uniCloud.database()
	const commentTb = db.collection('comment')
	const userTb = db.collection('uni-id-users')

	export default {
		components: {
			commentItem,
		},
		onLoad(e) {
			const topComment = uni.getStorageSync('temp-comment')
			this.topComment = topComment
			console.log({
				topComment
			});

			// 初始化数据
			this.postData.article_id = topComment.article_id
			this.postData.reply_user_id = topComment.user_id[0]._id
			this.postData.reply_comment_id = topComment._id
			
			// debugger

			this.getComment()
		},
		onUnload() {
			// uni.removeStorageSync('temp-comment')
		},
		computed: {
			userName() {
				return `@：${getUserInfo.getUserName(this.topComment)}`
			}
		},
		data() {
			return {
				topComment: {},
				postData: {
					article_id: '',
					comment_type: 1,
					reply_user_id: '',
					reply_comment_id: '',
				},
				secondComment: [],

			};
		},
		methods: {
			handleComent(dataObj) {
				this.secondComment.unshift(dataObj)
				uni.$emit('updateCommentQuantity', this.postData.reply_comment_id)
			},
			async getComment() {
				try {
					const commentTempTb = commentTb.where(
							`reply_comment_id=='${this.topComment._id}' && comment_type==1`)
						.getTemp()

					const userTempTb = userTb.field(userField).getTemp()

					const res = await db.collection(commentTempTb, userTempTb).orderBy('comment_date desc').get()
					this.secondComment = res.result.data

					console.log('二级评论', res);
				} catch (e) {
					uni.showToast({
						title: "回复获取失败",
						icon: "none"
					})
				}

			},
		}
	}
</script>

<style lang="scss">
	.reply {
		.top {
			padding: 30rpx;
			border-bottom: 15rpx solid #eee;
		}

		.list {
			padding: 30rpx;
			padding-bottom: 120rpx;

			.row {
				padding-bottom: 15rpx;
			}
		}
	}
</style>